import React from 'react';
import QuestionForm from "../../components/AutoForm/QuestionForm";


class Demo extends React.Component {

  state = {
    data: [{
      name: "java1",
      label: "变量命名规范说法正确的是（）",
      type: "single",
      chosen: [
        {value: "A", option: "A、 变量由字母、下划线、数字、$符号随意组成；"},
        {value: "B", option: "B、 变量不能以数字作为开头；"},
        {value: "C", option: "C、 A和a在java中是同一个变量；"},
        {value: "D", option: "D、 不同类型的变量，可以起相同的名字；"}
      ]
    },
      {
        name: "java2",
        label: "JAVA所定义的版本中不包括：（）",
        type: "multiple",
        chosen: [{value: "A", option: "A、JAVA2 EE"},
                 {value: "B", option: "B、JAVA2 SE"},
                 {value: "C", option: "C、JAVA2 ME"},
                 {value: "D", option: "D、JAVA2 HE"},
                 {value: "E", option: "E、JAVA2 Card"}]
      }],
    fieldValue: {}
  }
  handleSubmit = (values) => {
    console.log('Received values of form: ', values);
  };

  handleFieldsChange = (fields) => {
   let {data,fieldValue} = this.state;
    Object.keys(fields).map(key => {
      data.map(item => {
        if(item.name === key){
          if(fields[key]['value']){
            const start = item.label.indexOf("（");
            item.label = item.label.slice(0, start+1) + fields[key]['value'] + "）";
          }
        }
      })
    })
    console.log(fields);
    const modalForm = {
      ...fieldValue,
      ...fields
    }
    this.setState({data: data, fieldValue: modalForm});
  }

  render() {
    return (
      <QuestionForm
        formData={this.state.data}
        fieldValue={this.state.fieldValue}
        onFieldsChange={this.handleFieldsChange}
        onSubmit={this.handleSubmit}
      />
    );
  }
}


export default Demo;
